<template>
	<view>
		<ul>
			<li v-for="item,index in fL" :key="item.id">{{item.name}}</li>
			<li>全部分类</li>
		</ul>
	</view>
</template>

<script>
import {ref} from 'vue'
	import {getHotrecom} from '../../unti/api.js'
export default{
	setup(props, context) {
		let fL=ref([])
		const Fl=getHotrecom().then((res)=>{
			fL.value=res.data.data.slice(0,7)
			// console.log(fL);
		})
		return {
		fL
		}
	}
}
</script>

<style>
li{
	list-style: none;
	width: 22%;
	height: 30px;
	line-height: 30px;
	text-align: center;
margin: 10px 0; 
background-color:whitesmoke;
border-radius: 4px;
font-size: 14px;
}
ul{
	margin: 0;
	padding: 0;
	display: flex;
flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-around;
}
</style>